import { Button, Col, Form, Input, Row, Select, Space } from 'antd'
import indexStyle from './index.less'
import React from 'react'

export default class MMLogin extends React.PureComponent {
  constructor (props) {
    super(props)
    this.state = {
      isChoice: false
    }
  }

  setIsChoice = () => {
    const { isChoice } = this.state
    this.setState({
      isChoice: !isChoice
    })
  }

  getYZM = () => {

  }

  render () {
    return (
      <Form size={'large'}>
        <Row>
          <Col span={24}>
            <Form.Item>
              <Space.Compact className={indexStyle.loginContentInput}>
                <Select
                  defaultValue="+86"
                  options={this.options}
                  style={{ width: '25%' }}
                />
                <Input
                  style={{
                    width: '75%',
                  }}
                  defaultValue="26888888"
                />
              </Space.Compact>
            </Form.Item>
          </Col>
        </Row>
        <Row>
          <Col span={24}>
            <Form.Item>
              <Input
                className={indexStyle.loginContentInput}
                addonAfter={
                  <span onClick={this.getYZM} style={{ cursor: 'pointer' }}>获取验证码</span>
                }
                placeholder={'6位数字验证码'}
              />
            </Form.Item>
          </Col>
        </Row>
        <Row style={{ marginTop: '20px' }}>
          <Col span={24}>
            <Form.Item>
              <Button type={'primary'} className={indexStyle.loginBtn}>登录/注册</Button>
            </Form.Item>
          </Col>
        </Row>
        {/*<Row>*/}
        {/*  <Col span={24}>*/}
        {/*    <Form.Item>*/}
        {/*      <Flex gap={'small'} align={'center'} justify={'center'}>*/}
        {/*        <div onClick={this.setIsChoice} className={indexStyle.loginContentZFX}>*/}
        {/*          <strong>{this.state.isChoice ? '√' : ''}</strong>*/}
        {/*        </div>*/}
        {/*        <a style={{ fontSize: '13px', color: 'black' }}>我已阅读并同意 服务条款 和 隐私协议</a>*/}
        {/*      </Flex>*/}
        {/*    </Form.Item>*/}
        {/*  </Col>*/}
        {/*</Row>*/}
      </Form>
    )
  }
}
